<template>
  <a-modal
    :width="600"
    :visible="visible"
    :maskClosable="false"
    :title="`${text}题库`"
    :bodyStyle="{padding: '10px'}"
    @cancel="handleCancel"
  >
    <template slot="footer">
      <a-button :disabled="mode === 'detail'" key="submit" type="primary" :loading="loading" @click="handleSubmit">{{ text }}</a-button>
      <a-button key="back" @click="handleCancel">取消</a-button>
    </template>

    <a-form-model :model="form" :rules="rules" ref="validateForm" :labelCol="labelCol" :wrapperCol="wrapperCol">
      <a-form-model-item
        label="题库名称"
        prop="examName"
      >
        <a-input v-model="form.examName" />
      </a-form-model-item>

      <a-form-model-item
        label="题库备注"
        prop="examRemark"
      >
        <a-textarea v-model="form.examRemark" :auto-size="{ minRows: 3, maxRows: 5 }" />
      </a-form-model-item>

    </a-form-model>
  </a-modal>
</template>

<script>
import moment from 'moment'
import itemBankService from '@/service/exam/itemBankManage'

export default {
  data () {
    return {
      id: null,
      text: '',
      mode: 'add',
      visible: false,
      loading: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      form: {
        examName: '',
        examRemark: ''
      },
      rules: {
        examName: [{ required: true, message: '题库名称不能为空', trigger: 'blur' }]
      }
    }
  },
  methods: {
    showAdd () {
      this.text = '新增'
      this.mode = 'add'
      this.visible = true
      this.resetFields()
    },
    showEdit (record) {
      this.text = '修改'
      this.mode = 'edit'
      const { examId, examName, examRemark } = record
      this.form = { examName, examRemark }
      this.id = examId
      this.visible = true
    },
    async save () {
      this.loading = true
      const result = {
        ...this.form,
        status: 1,
        questionSource: 1,// 题目来源 0：试题创建 1（题库） 通过题目生成
        createTime: moment().format('YYYY-MM-DD HH:mm:ss')
      }
      const { code, msg } = await itemBankService.add(result)
      this.loading = false
      if (code === 200) {
        this.$message.success('保存成功')
        this.visible = false
        this.$emit('ok')
      } else {
        this.$message.error(msg || '保存记录失败')
      }
    },
    async edit () {
      this.loading = true
      const result = {
        id: this.id,
        updateTime: moment().format('YYYY-MM-DD HH:mm:ss'),
        ...this.form
      }
      const { code, msg } = await itemBankService.edit(result)
      this.loading = false
      if (code === 200) {
        this.$message.success('修改记录成功')
        this.visible = false
        this.$emit('ok')
      } else {
        this.$message.error(msg || '修改记录失败')
      }
    },
    handleSubmit () {
      this.$refs['validateForm'].validate(valid => {
        if (!valid) return false
        if (this.mode === 'add') {
          this.save()
        }
        if (this.mode === 'edit') {
          this.edit()
        }
      })
    },
    handleCancel () {
      this.visible = false
      this.resetFields()
    },
    resetFields () {
      this.id = null
      this.form = {
        examName: '',
        examRemark: ''
      }
    }
  }

}
</script>
